<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>StudentList</title>
    <script type="text/javascript" src="./js/jquery.min.js"></script>
    <script type="text/javascript">
        $(function() {
            /* For zebra striping */
            $("table tr:nth-child(odd)").addClass("odd-row");
            /* For cell text alignment */
            $("table td:first-child, table th:first-child").addClass("first");
            /* For removing the last border */
            $("table td:last-child, table th:last-child").addClass("last");

            /**
             * 选择全部
             */
            $("#selectBtn").click(function(){
                $("tbody input[name='select[]']").prop("checked",this.checked);//监测在tbody标签下input名为select[]的是否被勾选
            })

            /**
             * 取消全选
             */
            $("input[name='select[]']").on("click",function(){
                var flag = true;
                for (var i = 0; i < $("input[name='select[]']").length; i++) {
                    if (!$($("input[name='select[]']")[i]).is(":checked")) {
                        flag = false;
                        break;
                    }
                }
                $("#selectBtn").prop("checked", flag);
            });

        });

    </script>

    <style type="text/css">

        html, body, div, span, object, iframe,
        h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        abbr, address, cite, code,
        del, dfn, em, img, ins, kbd, q, samp,
        small, strong, sub, sup, var,
        b, i,
        dl, dt, dd, ol, ul, li,
        fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td {
            margin:0;
            padding:0;
            border:0;
            outline:0;
            font-size:100%;
            vertical-align:baseline;
            background:transparent;
        }

        body {
            margin:0;
            padding:0;
            font:12px/15px "Helvetica Neue",Arial, Helvetica, sans-serif;
            color: #555;
            background:#f5f5f5;
        }

        a {color:#666;}

        table {
            overflow:hidden;
            border:1px solid #d3d3d3;
            background:#fefefe;
            width:70%;
            margin:4% auto 0;
            -moz-border-radius:5px; /* FF1+ */
            -webkit-border-radius:5px; /* Saf3-4 */
            border-radius:5px;
            -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
            -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
        }

        th, td {padding:18px 28px 18px; text-align:center; }

        th {padding-top:22px; text-shadow: 1px 1px 1px #fff; background:#e8eaeb;}

        td {border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;}

        tr.odd-row td {background:#f6f6f6;}

        td.first, th.first {text-align:left}

        td.last {border-right:none;}


        td {
            background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);
            background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));
        }

        tr.odd-row td {
            background: -moz-linear-gradient(100% 25% 90deg, #f6f6f6, #f1f1f1);
            background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f1f1f1), to(#f6f6f6));
        }

        th {
            background: -moz-linear-gradient(100% 20% 90deg, #e8eaeb, #ededed);
            background: -webkit-gradient(linear, 0% 0%, 0% 20%, from(#ededed), to(#e8eaeb));
        }

        tr:first-child th.first {
            -moz-border-radius-topleft:5px;
            -webkit-border-top-left-radius:5px; /* Saf3-4 */
        }

        tr:first-child th.last {
            -moz-border-radius-topright:5px;
            -webkit-border-top-right-radius:5px; /* Saf3-4 */
        }

        tr:last-child td.first {
            -moz-border-radius-bottomleft:5px;
            -webkit-border-bottom-left-radius:5px; /* Saf3-4 */
        }

        tr:last-child td.last {
            -moz-border-radius-bottomright:5px;
            -webkit-border-bottom-right-radius:5px; /* Saf3-4 */
        }
        .title{
            width: 200px;
            margin: 40px auto;
            text-align: center;
            font-size: x-large;
        }
        .oper{
            width: 50%;
            margin: 20px auto 40px auto;
            text-align: center;
            display: flex;
            font-size: large;

        }
        .add, .delete{
            flex: 0.5;
        }
        .footer{
            background-color: #efefef;
            line-height: 80px;
            margin: 0 auto;
            text-align: center;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;

        }
        .formQuery{
            text-align: center;
            margin-bottom: -20px;
            color: #666;
            font-size: initial;
        }
    </style>
</head>
<body>
<?php
include "./conn.php";    //连接数据库
/*
 * 删除学生信息
 */
if(isset($_REQUEST['delete'])){
    if(isset($_REQUEST["select"])){
        $nums = $_REQUEST["select"];   //获取被选中的id数组
        for ($i = 0; $i < count($nums); $i++){
            mysqli_query($con,"delete from stu where sno=$nums[$i]");  //执行删除语句
            echo "<script language='JavaScript'>location.href='stuList.php'</script>";  //删除之后重新进入页面
        }
    }else echo "<script language='JavaScript'>alert('请选择需要删除的数据')</script>";  //没有选中提示
}
?>
<div class="title">学生信息列表</div>
<form action="" method="post" name="queryLike" class="formQuery" id="formQuery">
    <div>
        请输入查询的姓名：<input type="text" name="keyword">
        <input type="hidden" name="page" value="1">
        <a href="javascript:void(0)" class="query" onclick="document.getElementById('formQuery').submit()">查询</a>
    </div>
</form>
<form action="" method="post" name="stulist" id="stulist">
    <input type="hidden" name="delete" value="del">
    <table cellspacing="0">
        <tr>
            <th>全选 <input id="selectBtn" type="checkbox" name="selectAll"></th>
            <th>学号</th>
            <th>姓名</th>
            <th>密码</th>
            <th>性别</th>
            <th>生日</th>
            <th>学院</th>
            <th>电话</th>
            <th>邮箱</th>
            <th>图片</th>
        </tr>
        <?php
        /*
         *关键字查询
         */
        if(isset($_REQUEST['keyword'])){
            $keyword = $_REQUEST['keyword'];   //设置关键字
        }else{
            $keyword = "";    //默认为空
        }
        /*
         * 分页
         */
        $sql = "select * from stu where sname like '%$keyword%'";
        $result = mysqli_query($con,$sql);
        $count = mysqli_num_rows($result);    //计算总页数
        $pageSize = 8;    //每页要显示的条数
        $count%$pageSize==0 ? $pageCount = $count/$pageSize : $pageCount = (int)($count/$pageSize)+1;    //计算实际要显示多少页

        if (isset($_REQUEST["page"])){
            $page = $_REQUEST["page"];    //获取表单传过来的页数
            $keyword = $_REQUEST['keyword'];    //获取模糊查询关键字
            $currentPage = intval($page);    //设置当前页
        }else {
            $currentPage = 1;    //默认当前页
        }
        //分页和模糊查询一起
        $sql = "select * from stu where sname like '%$keyword%' limit ".($currentPage-1)*$pageSize.",".$pageSize;
        $result = mysqli_query($con,$sql);
        $num = mysqli_num_rows($result);    //获取结果集行数
        for ($i = 0; $i < $num; $i++) {
            $rows = mysqli_fetch_row($result);
            ?>
            <tr>
                <td><input type='checkbox' id="select" name='select[]' value='<?php echo $rows[0]?>'></td>
                <td><a href='./updateStu.php?id=<?php echo $rows[0]?>'><?php echo $rows[0]?></a></td>
                <td><?php echo $rows[1]?></td>
                <td><?php echo $rows[2]?></td>
                <td><?php echo $rows[3]?></td>
                <td><?php echo $rows[4]?></td>
                <td><?php echo $rows[5]?></td>
                <td><?php echo $rows[6]?></td>
                <td><?php echo $rows[7]?></td>
                <td><img width="25px" src="./images/<?php echo $rows[8]?>" alt=""><?php echo $rows[8]?></td>
            </tr>
        <?php } ?>
    </table>

    <div class="oper">
        <div class="add"><a href="addStu.php">添加</a></div>
        <div class="page">
            <?php if($count<=$pageSize);
                  elseif ($currentPage==1) echo "<a href=\"stuList.php?page=".($currentPage+1)."&&keyword=$keyword \">[下一页]</a>
                                                 <a href=\"stuList.php?page=$pageCount&&keyword=$keyword \">[尾页]</a>";
                  elseif ($currentPage==$pageCount) echo "<a href=\"stuList.php?page=1&&keyword=$keyword \">[首页]</a>
                                                          <a href=\"stuList.php?page=".($currentPage-1)."&&keyword=$keyword \">[上一页]</a>";
                  else echo "<a href=\"stuList.php?page=1&&keyword=$keyword \">[首页]</a>
                             <a href=\"stuList.php?page=".($currentPage-1)."&&keyword=$keyword \">[上一页]</a>
                             <a href=\"stuList.php?page=".($currentPage+1)."&&keyword=$keyword \">[下一页]</a>
                             <a href=\"stuList.php?page=$pageCount&&keyword=$keyword \">[尾页]</a>"
            ?>
            当前第<?php echo $currentPage?>页 共有<?php echo $pageCount?>页
        </div>
        <div class="delete"><a href="javascript:void(0)" onclick=" confirm('确定删除?')?document.getElementById('stulist').submit():''; ">删除</a></div>
    </div>
</form>

<div class="footer" style="position:absoluate">© Cherry </div>
</body>
</html>